
new Vue({
    el: '#home',
    data() {
        return {
            // 顶部nav
            headNav: '',
            // 底部nav
            footerNav: '',
            // 底部友链
            Links: '',
            // 首页搜索
            keyWords: '',
            // 定位导航搜索
            keyWordss: '',
            // 首页搜索下方区域展示
            isShowSearch: false,
            // 搜索山体信息
            wordLists: '',
            // 首页最新公告
            newNotice: '',
            // 首页时政信息
            indexList: [],
            // 首页山脉风景图
            slideImgs: [],
            // 首页轮播图
            scenerylbt: [],
            // 公共监督 一键呼叫数据
            phoneList: [],
            // 平台信息 右侧导航栏
            articleList: [],
            // 平台信息，右侧导航栏高亮
            currentArticle: '0',
            // 平台信息，右侧导航点击后的资讯列表
            articleLists: [],
            // 文章资讯详情页面数据
            articleDetail: '',
            // 文章资讯详情来源
            category: '',
            // 文章资讯详情页面 / 首页通知公告
            noticeLists: [],
            // 山体信息页面 左侧区域
            allCitys: [],
            // 是否展示山脉风景遮罩层
            isShowMaskLayer: null,
            // 右侧详情 / 表单提交区域
            mounTains: [],
            // 表单提交区域 二级菜单
            mounTainsLevel: [],
            // 平台信息 最热资讯
            hotArticle: [],
            // 山体详情 图片展示
            mounList: [],
            // 互动参与 / 事件上报 名字
            name: '',
            // 互动参与 / 事件上报 电话
            phone: '',
            // 公众监督 标题
            title: '',
            // 公众监督 描述
            desc: '',
            // 精度
            longitude: 117.071470317,
            // 纬度
            latitude: 36.600423896,
            // 首页 结束纬度
            endlatitude: '',
            // 首页结束 纬度
            endlongitude: '',
            // 首页 开始纬度
            startlatitude: '',
            // 首页 开始纬度
            startlongitude: '',
            // 山体id
            mountain_id: null,
            // 全局状态提示框
            isShownotifica: false,
            // 全局提示框文字
            notificaInfo: '提交成功',
            // 全局提示框倒计时
            infoTimes: '',
            // 互动参与列表
            interactiveList: [],
            // 互动参与 已上传的图片展示
            upImgList: [],
            // 联级选择 箭头方向 默认朝下
            seleceArrow: true,
            // 选择山体展示
            mounName: '请选择',
            // 事件上报 时间选择
            yearmonth: '',
            // 事件上报时分秒
            minutes: '',
            // 上传图片成功返回的图片
            inspectionImg: [],
            // 首页互动参与
            indexAllList: [],
            // 首页山体信息
            mountainIndex: [],
            // 首页 山脉风景图
            mountainScenery: [],
            // 是否显示返回顶部
            scrollTop: '',
            // 山体信息 是否高亮
            isShowMouninfo: 0,
            // 地图功能 x和y坐标
            x: 117.071470317,
            y: 36.600423896,
            // 当前页数
            currentPage: '1',
            // 总页数
            totalPage: null,
            // 当前选中页数
            currentPages: 0,
            // 是否为二级分页
            secondaryPaging: false,
            // 二级分类 / 三级图表区域当前id
            secondaryCurrId: null,
            // 所有山体坐标
            Locations: '',
            // 三级图表 街道信息
            streetsByAreaList: [],
            // 三级图表 根据街道获取山体
            mountainByStreets: [],
            // 三级图表显示隐藏
            showStreetsByArea:false,
            // 选择的区域
            currentAreaName: '',
            // 选择的街道
            currentStreetName: '',
            // 山体详情 数据
            mounDetailInfo: '',
            // 当前街道id
            currentStreetId: '',
            // 分页总页数
            allTotalPages: null,
            // 非空校验
            dataEmpty: null,
            // 报错数组
            msgAlls:['','','','','','','',''],
            // 首页内打开iframe
            iframeGoToMap:'',
            // 山体详情管理目标文字
            mountainText:''
        }
    },
    mounted() {
        this.headNav = store.state.headNav
        this.footerNav = store.state.footerNav
        this.Links = store.state.Links
        // 注册滚动事件
        window.addEventListener("scroll", this.showbtn, true);
        // 获取搜索页面地址栏id
        let url = getUrlParams()
        // 首页
        if (url == 'index.html') {
            let that = this
            // 获取最新公告
            getNewNotice().then(res => {
                if (res.code == 200) {
                    that.newNotice = res.data
                }
            })
            // 获取时政信息
            getIndexList().then(res => {
                if (res.code == 200) {
                    that.indexList = res.data.data
                }
            })
            // 公示公告
            getNoticeList().then(res => {
                if (res.code == 200) {
                    that.noticeLists = res.data.data
                }
            }),
                // 首页互动参与
                getAllList().then(res => {
                    if (res.code == 200) {
                        that.indexAllList = res.data
                    }
                })
            // 首页山体信息
            mountainIndex().then(res => {
                if (res.code == 200) {
                    that.mountainIndex = res.data
                }
            })
            // 首页山脉风景
            getMountainScenery().then(res => {
                if (res.code == 200) {
                    that.mountainScenery = res.data
                    // 解决bug 数据还没有获取到 轮播图已经创建
                    setTimeout(() => {
                        new Swiper('.swiper-container', {
                            slidesPerView: 4,
                            slidesPerGroup: 1,
                            loop: true,
                            centeredSlides: true,
                            loopFillGroupWithBlank: true,

                            // 如果需要分页器
                            pagination: {
                                el: '.swiper-pagination',
                            },

                            // 如果需要前进后退按钮
                            navigation: {
                                nextEl: '.swiper-button-next',
                                prevEl: '.swiper-button-prev',
                            },

                        })
                    }, 100)
                }
            })
            // 首页山脉风景
            getSlideshow().then(res => {
                if (res.code == 200) {
                    this.scenerylbt = res.data
                }
            })
            // 首页轮播图
            getScenery().then(res => {
                if (res.code == 200) {
                    // this.scenerylbt = res.data
                    this.slideImgs = res.data
                    // 解决先渲染后加装数据导致无法正常滚动的bug
                    setTimeout(() => {
                        new Swiper('.swiper_index', {
                            direction: 'horizontal', // 垂直切换选项
                            loop: true, // 循环模式选项
                            grabCursor: true,
                            autoplay: true,
                            delay: 1000,
                            // 如果需要分页器
                            pagination: {
                                el: '.swiper-pagination',
                            },
                            // 如果需要前进后退按钮
                            navigation: {
                                nextEl: '.swiper-button-next',
                                prevEl: '.swiper-button-prev',
                            }
                        })
                    }, 10)
                }
            })
            // // 定位导航
            let map = new BMap.Map("map_container");    // 创建Map实例
            let geolocation = new BMap.Geolocation();
            geolocation.getCurrentPosition(function (r) {
                if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                    that.longitude = r.point.lng
                    that.latitude = r.point.lat
                }
                else {
                    alert('failed' + this.getStatus());
                }
            }, { enableHighAccuracy: true })
            map.centerAndZoom(new BMap.Point(that.longitude, that.latitude), 14);  // 初始化地图,设置中心点坐标和地图级别
            //添加地图类型控件
            map.addControl(new BMap.MapTypeControl({
                mapTypes: [
                    BMAP_NORMAL_MAP,
                    BMAP_HYBRID_MAP
                ]
            }));
            map.setCurrentCity("济南");
            map.enableScrollWheelZoom(true);
            // var geolocation = new BMap.Geolocation();
            // 地址解析
            let geoc = new BMap.Geocoder();
            map.addEventListener("tilesloaded", function () {
                let pt = { lat: that.latitude, lng: that.longitude }
                geoc.getLocation(pt, function(rs) {
                    // console.log(rs);
                })
            });

            // 创建标注
            let point = new BMap.Point(that.longitude, that.latitude);
            let marker = new BMap.Marker(point);  // 创建标注
            map.addOverlay(marker);               // 将标注添加到地图中
            marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
            // 点击事件
            function showInfo(e) {
                // 点击前移除之前的点击事件
                that.startlongitude = e.point.lng
                that.startlatitude = e.point.lat
                // 移除之前标注点
                map.clearOverlays()
                let point = new BMap.Point(e.point.lng, e.point.lat);
                let marker = new BMap.Marker(point);
                map.addOverlay(marker);
                marker.setAnimation(BMAP_ANIMATION_BOUNCE);

                let pt = e.point
                geoc.getLocation(pt, function (rs) {
                    let addComp = rs.addressComponents;
                    // this.startlatitude, this.startlongitude
                    that.$refs.curremtPosition.value = addComp.city + addComp.district + addComp.street + addComp.streetNumber
                });
            }
            map.addEventListener("click", showInfo);

        }


        // 搜索页面
        if (url == 'search.html') {
            let keyWords = window.location.href.split('?')[1].split('=')[1]
            searchMountains(keyWords).then(res => {
                if (res.code == 200) {
                    this.wordLists = res.data
                }
            })
        }
        //公共监督页面
        if (url == 'supervise.html') {
            // 获取地址栏页数
            this.currentPage = getPages()
            // 获取一键呼叫数据
            getPhone(this.currentPage, 6).then(res => {
                if (res.code == 200) {
                    this.phoneList = res.data.data
                    this.allTotalPages = res.data.total
                    this.totalPage = Math.ceil(res.data.total / 6)
                    this.currentPages = this.currentPage - 1
                } else {
                    this.phoneList = []
                }
            })
        }
        // 平台信息
        if (url == 'information.html') {
            // 获取地址栏页数
            this.currentPage = getPages()
            //    右侧导航栏数据
            getArticleTypeList().then(res => {
                if (res.code == 200) {
                    this.articleList = res.data
                    getArticleList(this.articleList[0].id, this.currentPage, 6).then(res => {
                        if (res.code == 200) {
                            this.articleLists = res.data.data
                            this.allTotalPages = res.data.total
                            this.totalPage = Math.ceil(res.data.total / 6)
                            this.currentPages = this.currentPage - 1
                        }
                    })
                }
            })
            // 互动参与信息
            getAllList().then(res => {
                if (res.code == 200) {
                    this.indexAllList = res.data
                }
            })

        }
        // 资讯详情页面
        if (url == 'mationDetails.html') {
            let id = window.location.href.split('?')[1].split('=')[1]
            axios.all([getArticleDetail(id), getNoticeList(), getHotArticle()]).then(
                axios.spread((article, notice, inlist) => {
                    if (article.code == 200 && notice.code == 200 && inlist.code == 200) {
                        this.articleDetail = article.data
                        this.category = article.data.category
                        this.noticeLists = notice.data.data
                        this.hotArticle = inlist.data
                    }
                }))
        }
        // 山体信息页面
        if (url == 'mouninfo.html') {
            // 获取地址栏页数
            this.currentPage = getPages()
            getAllCitys().then(res => {
                if (res.code == 200) {
                    this.allCitys = res.data
                    getMountains(this.allCitys[0].id, this.currentPage, 6).then(res => {
                        if (res.code == 200) {
                            this.mounTains = res.data.data
                            console.log(this.mounTains);
                            this.allTotalPages = res.data.total
                            this.totalPage = Math.ceil(res.data.total / 6)
                            this.currentPages = this.currentPage - 1
                        }
                    })
                }
            })
            // 初始化地图
            this.fn()
        }
        // 山体详情信息
        if (url == 'mounDetails.html') {
            let id = window.location.href.split('?')[1].split('=')[1]
            mountainDetail(id).then(res => {
                if (res.code == 200) {
                    res.data.image? this.mounList = res.data.image.split('|'):'' 
                    this.mounDetailInfo = res.data 
                }
            })
            getMountainText() .then((res) => {
                if(res.code == 200) {
                    this.mountainText = res.data.text
                }
            })
            // 最热资讯
            getHotArticle().then(res => {
                if (res.code == 200) {
                    this.hotArticle = res.data
                }
            })
        }
        // 互动参与
        if (url == 'interactive.html') {
        }
        // 事件上报
        if (url == 'reporting.html') {
        }
        // 三级图表
        if (url == 'chart.html') {
            // 批量注册标注点
            this.fn()
        }
    },
    methods: {
        // 点击搜索列表进详情
        goDetails() {
            window.location.href = `search.html?name=${this.keyWords}`
        },
        // 点击山体列表进入详情
        mounDetails(id) {
            window.location.href = `mounDetails.html?id=${id}`
        },
        // 点击最新公告 进入公告列表
        goNoticeDetails() {
        },
        // 公共监督 右侧导航栏点击
        article(index, id) {
            this.currentArticle = index
            this.currentPage = 1
            this.secondaryCurrId = id
            this.secondaryPaging = true
            // 根据导航栏id获取
            getArticleList(this.secondaryCurrId, this.currentPage, 6).then(res => {
                if (res.code == 200) {
                    this.articleLists = res.data.data
                    this.allTotalPages = res.data.total
                    this.totalPage = Math.ceil(res.data.total / 6)
                    this.currentPages = this.currentPage - 1
                } else {
                    this.articleLists = []
                }
            })
        },
        // 点击文章列表进入文章详情
        goMationDetails(id) {
            window.location.href = `mationDetails.html?id=${id}`

        },
        // 点击山体信息左侧导航栏
        getMountains(id, index) {
            this.isShowMouninfo = index
            this.secondaryCurrId = id
            this.currentPage = 1
            // 开启二级分页切换
            this.secondaryPaging = true
            getMountains(id, this.currentPage, 6).then(res => {
                if (res.code == 200) {
                    this.mounTains = res.data.data
                    this.allTotalPages = res.data.total
                    this.totalPage = Math.ceil(res.data.total / 6)
                    this.currentPages = this.currentPage - 1
                } else {
                    this.mounTains = []
                }
            })
        },
        // 点击热门资讯返回平台信息
        returnInformation() {
            window.location.href = `information.html?page=1`
        },
        // 公众监督 数据提交
        subSuperviseInfo(index) {
            let that = this
            let data = {}
            // 公共监督
            if (index == 1) {
                data = {
                    title: that.title,
                    desc: that.desc,
                    name: that.name,
                    phone: that.phone,
                    img: that.inspectionImg.join('|')
                }
                subSuperviseInfo(data).then(res => {
                    if (res.code == 200) {
                        that.title = ''
                        that.desc = ''
                        that.name = ''
                        that.phone = ''
                        that.inspectionImg = [],
                            that.upImgList = [],
                            that.isShownotifica = true
                        clearInterval(that.infoTimes)
                        that.notificaInfo = res.msg
                        that.infoTimes = setTimeout(() => {
                            that.isShownotifica = false
                        }, 1000)
                    } else {
                        that.isShownotifica = true
                        that.notificaInfo = res.msg
                        clearInterval(that.infoTimes)
                        that.infoTimes = setTimeout(() => {
                            that.isShownotifica = false
                        }, 1000)
                    }
                })
            }
            // 互动参与
            else if (index == 2) {
                    data = {
                        title: that.title,
                        desc: that.desc,
                        username: that.name,
                        phone: that.phone,
                        longitude: that.longitude,
                        latitude: that.latitude,
                        mountain_id: that.mountain_id,
                        img: that.inspectionImg.join('|')
                    }
                    subInteractiveInfo(data).then(res => {
                        console.log(res);
                        if (res.code == 200) {
                            that.isShownotifica = true
                            that.notificaInfo = res.msg
                            that.title = '',
                                that.desc = '',
                                that.name = '',
                                that.phone = '',
                                that.longitude = '',
                                that.latitude = '',
                                that.mountain_id = '',
                                that.inspectionImg = [],
                                that.upImgList = [],
                                that.mounName = '请选择'
                            clearInterval(that.infoTimes)
                            that.infoTimes = setTimeout(() => {
                                that.isShownotifica = false
                            }, 1000)
                        } else {
                            that.dataEmpty = res.msg
                            that.isShownotifica = true
                            that.notificaInfo = res.msg
                            clearInterval(that.infoTimes)
                            that.infoTimes = setTimeout(() => {
                                that.isShownotifica = false
                            }, 1000)
                        }
                    })
            }
            // 事件上报
            else {
                data = {
                    inspection_des: that.desc,
                    nickname: that.name,
                    mobile: that.phone,
                    mountain_id: that.mountain_id,
                    happen_time: that.$refs.yearmonth.value + ' ' +  that.$refs.minutes.value,
                    longitude: that.longitude,
                    latitude: that.latitude,
                    inspection_img: that.inspectionImg.join('|')
                }
                setInspection(data).then(res => {
                    if (res.code == 200) {
                        that.isShownotifica = true
                        that.title = '',
                            that.desc = '',
                            that.name = '',
                            that.phone = '',
                            that.longitude = '',
                            that.latitude = '',
                            that.mountain_id = '',
                            that.inspectionImg = [],
                            that.upImgList = [],
                            that.mounName = '请选择',
                            that.$refs.yearmonth.value = '',
                            that.$refs.minutes.value = ''
                        clearInterval(that.infoTimes)
                        that.infoTimes = setTimeout(() => {
                            that.isShownotifica = false
                        }, 1000)
                    } else {
                        that.isShownotifica = true
                        that.notificaInfo = res.msg
                        clearInterval(that.infoTimes)
                        that.infoTimes = setTimeout(() => {
                            that.isShownotifica = false
                        }, 1000)
                    }
                })
            }

        },
        // 上传图片
        upImgs() {
            let that = this
            let fileList = that.$refs.file.files
            let file = fileList[0]
            const fileReader = new FileReader()
            fileReader.readAsDataURL(file)
            // onload 这个事件在读取完成后触发
            fileReader.addEventListener('load', function () {
                let res = fileReader.result
                that.upImgList.push(res)
                let data = {
                    name: file.name,
                    file: res
                }
                uploader(data).then(res => {
                    if (res.data.code == 200) {
                        that.inspectionImg.push('http://image.sdxing.cn/' + res.data.data)
                        that.isShownotifica = true
                        that.notificaInfo = res.data.msg
                        that.infoTimes = setTimeout(() => {
                            clearInterval(that.infoTimes)
                            that.isShownotifica = false
                        }, 1000)
                    }
                })
            })
        },
        // 删除图片
        deletes(index) {
            this.upImgList.splice(index, 1)
            this.inspectionImg.splice(index, 1)
        },
        // 互动参与联级选择
        seleceInfo(e,i) {
            this.seleceArrow = !this.seleceArrow
            this.mounTainsLevel = []
            // 判断是否有数据
            if (this.mounTains.length > 0) {
                return
            } else {
                // 获取所有区域
                getAllCitys().then(res => {
                    if (res.code == 200) {
                        this.mounTains = res.data
                    }
                })
            }
            if(this.mounName == '请选择'){
                this.dataEmpty = false
                this.msgAlls[i] = '请选择山体';
                this.dataEmpty = true
            }else{
                this.dataEmpty = false
                this.msgAlls[i] = '';
                this.dataEmpty = true
            }
        },
        // 根据区域获取详情山体
        mountainsLevel(id) {
            getMountains(id).then(res => {
                if (res.code == 200) {
                    this.mounTainsLevel = res.data.data
                }
            })
        },
        // 点击二级菜单的山体
        mounTainsLevels(data,i) {
            this.mounTainsLevel = []
            this.seleceArrow = true
            this.longitude = data.longitude
            this.latitude = data.latitude
            this.mountain_id = data.id
            this.mounName = data.mountain_name
            this.dataEmpty = false
            this.msgAlls[i] = '';
            this.dataEmpty = true
        },
        // 首页 山脉风景 鼠标移入事件
        enter(data, index) {
            this.isShowMaskLayer = index
        },
        // 显示返回顶部按钮
        showbtn() {
            let that = this;
            let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
            that.scrollTop = scrollTop >= 1000
        },
        // 返回顶部
        backtop() {
            let timer = setInterval(function () {
                let osTop = document.documentElement.scrollTop || document.body.scrollTop;
                let ispeed = Math.floor(-osTop / 5);
                document.documentElement.scrollTop = document.body.scrollTop = osTop + ispeed;
                this.isTop = true;
                if (osTop === 0) {
                    clearInterval(timer);
                }
            }, 30)
        },
        // 首页终点输入
        searchMoun() {
            searchMountains(this.keyWordss).then(res => {
                if (res.code == 200) {
                    this.wordLists = res.data
                } else {
                    this.wordLists = []
                }
            })
        },
        // 前往下一页
        nextPage(index, type) {
            // 点击分页的时候先判断是否是二级分页
            if (this.secondaryPaging) {
                // 如果是山体信息页面
                if (type == 'mouninfo') {
                    getMountains(this.secondaryCurrId, index + 1, 6).then(res => {
                        if (res.code == 200) {
                            this.mounTains = res.data.data 
                            this.allTotalPages = res.data.total
                            this.totalPage = Math.ceil(res.data.total / 6)
                            // 高亮
                            this.currentPages = index
                        } else {
                            this.mounTains = []
                        }
                    })
                }
                // 如果是平台信息
                else if (type == 'info') {
                    getArticleList(this.secondaryCurrId, index + 1, 6).then(res => {
                        if (res.code == 200) {
                            this.articleLists = res.data.data
                            this.allTotalPages = res.data.totla
                            this.totalPage = Math.ceil(res.data.total / 6)
                            // this.currentPages = index + 1
                            this.currentPages = index
                        } else {
                            this.articleLists = []
                        }
                    })
                }

            } else {
                if (type == 'info') {
                    // 平台信息页面
                    window.location.href = `information.html?page=${index + 1}`
                } else if (type == 'super') {
                    // 公众监督页面
                    window.location.href = `supervise.html?page=${index + 1}`
                } else if (type == 'mouninfo') {
                    // 山体信息
                    window.location.href = `mouninfo.html?page=${index + 1}`
                }
            }


        },
        // 下一页按钮功能
        gotonextPage(type) {
            // 先确认是否是二级菜单状态
            if (this.secondaryPaging) {
               if(this.currentPages+1 == this.totalPage){
                   return
               }else{
                let page = this.currentPages + 1
                if (type == 'info') {
                    getArticleList(this.secondaryCurrId, page + 1, 6).then(res => {
                        if (res.code == 200) {
                            this.articleLists = res.data.data
                            this.allTotalPages = res.data.totla
                            this.totalPage = Math.ceil(res.data.total / 6)
                            // this.currentPages = index + 1
                            this.currentPages = this.currentPages + 1
                        } else {
                            this.articleLists = []
                        }
                    })

                } else if (type == 'mouninfo') {
                    getMountains(this.secondaryCurrId, page + 1, 6).then(res => {
                        if (res.code == 200) {
                            this.mounTains = res.data.data
                            this.allTotalPages = res.data.total
                            this.totalPage = Math.ceil(res.data.total / 6)
                            // 高亮
                            this.currentPages = this.currentPages + 1
                        } else {
                            this.mounTains = []
                        }
                    })
                } else {
                    let page = getPages()
                    window.location.href = `supervise.html?page=${+page + 1}`
                }
               }

            } else {
                let page = getPages()
                // if(this.totalPage)
                // 如果当前页等于总页数， 不再执行下一页功能
                if(this.currentPages+1 == this.totalPage){
                    return
                }else{
                    if (type == 'info') {
                        window.location.href = `information.html?page=${+page + 1}`
                    } else if (type == 'mouninfo') {
                        window.location.href = `mouninfo.html?page=${+page + 1}`
                    } else {
                        window.location.href = `supervise.html?page=${+page + 1}`
                    }
                }

            }



        },
        // 前往首页功能
        togoIndex(type) {
            // 判断是否是二级菜单状态
            if (this.secondaryPaging) {
                // 平台信息页面
                if (type == 'info') {
                    getArticleList(this.secondaryCurrId, 1, 6).then(res => {
                        if (res.code == 200) {
                            this.articleLists = res.data.data
                            this.allTotalPages = res.data.total
                            this.totalPage = Math.ceil(res.data.total / 6)
                            // this.currentPages = index + 1
                            this.currentPages = 0
                        } else {
                            this.articleLists = []
                        }
                    })
                }
                // 山体信息页面
                else if (type == 'mouninfo') {
                    getMountains(this.secondaryCurrId, 1, 6).then(res => {
                        if (res.code == 200) {
                            this.mounTains = res.data.data 
                            this.allTotalPages = res.data.total
                            this.totalPage = Math.ceil(res.data.total / 6)
                            // 高亮
                            this.currentPages = 0
                        } else {
                            this.mounTains = []
                        }
                    })
                } else {
                    window.location.href = `supervise.html?page=1`

                }
            } else {
                if (type == 'info') {
                    window.location.href = `information.html?page=1`
                } else if (type == 'mouninfo') {
                    window.location.href = `mouninfo.html?page=1`
                } else {
                    window.location.href = `supervise.html?page=1`
                }
            }


        },
        // 点击搜索的山体
        getCoordinates(data) {
            this.keyWordss = data.mountain_name
            this.$refs.keyWordss.style.display = 'none'
            this.endlatitude = data.latitude
            this.endlongitude = data.longitude
        },
        // 调起百度地图
        goBaiduMap() {
            if(!this.$refs.curremtPosition.value){
                this.$refs.curremtPosition.value = '济南市市中区'
            }
            if (!this.endlatitude) {
                alert('请输入终点')
            } else {
                this.iframeGoToMap = `http://api.map.baidu.com/direction?origin=latlng: ${this.startlatitude},${this.startlongitude} |name:${this.$refs.curremtPosition.value}&destination= ${this.keyWordss} &mode=driving&region=济南&output=html&src=webapp.baidu.openAPIdemo`
                this.$refs.iframeGoToMap.style.display = 'block'
                // window.location.href = `http://api.map.baidu.com/direction?origin=latlng: ${this.startlatitude},${this.startlongitude} |name:${this.$refs.curremtPosition.value}&destination= ${this.keyWordss} &mode=driving&region=济南&output=html&src=webapp.baidu.openAPIdemo`
            }

        },
        // 三级图表，根据济南获取区域
        getAllCitys() {
            getAllCitys().then(res => {
                if (res.code == 200) {
                    this.allCitys = res.data
                }
            })
        },
        // 三级图表 点击区域选择街道
        getStreetsByArea(data) {
            this.secondaryCurrId = data.id
            this.currentAreaName = data.name
            this.showStreetsByArea = true
            this.currentStreetName = ''
            // 获取街道信息
            getStreetsByArea(data.id).then(res => {
                if (res.code == 200) {
                    this.streetsByAreaList = res.data
                } else {
                    this.streetsByAreaList = []
                }
            })
        },
        // 三级图表 点击显示
        seleceInfos() {
            this.seleceArrow = !this.seleceArrow
            if (!this.seleceArrow) {
                this.$refs.seleame.style.display = 'block'
            } else {
                this.$refs.seleame.style.display = 'none'
            }
        },
        // 根据街道获取山体信息
        mountainByStreet(data) {
            this.currentStreetId = data.street_id;
            this.currentStreetName = data.street_name
            this.$refs.seleame.style.display = 'none'
            getMountainByStreet(data.street_id).then(res => {
                if (res.code == 200) {
                    this.mountainByStreets = res.data
                    this.seleceArrow = true
                }
            })
        },
        // 点击搜索
        closeSelectionBox() {
            this.fn()
            this.$refs.seleame.style.display = 'none'
            this.seleceArrow = true
        },
        // 表单校验
        changeCount(e,i){

            if(e.target.value == ''){
                this.dataEmpty = false
                this.msgAlls[i] = e.target.placeholder;
                if(e.target.placeholder == 'YYYY年MM月DD日'){
                    this.msgAlls[i] = '输入年月日';
                }
                if(e.target.placeholder == 'YYYY-MM-DD'){
                    this.msgAlls[i] = '输入时分秒';
                }
                this.dataEmpty = true
            } else{
                this.dataEmpty = false
                this.msgAlls[i] = '';
                this.dataEmpty = true

            }
        },
        // 时间选择校验
        changeCountTime(i){
            console.log(i);
        },
        // 关闭百度地图
        gbiframeGoToMap(){
            this.$refs.iframeGoToMap.style.display = 'none'
        },
        // 批量创建所有标注
        fn() {
            let that = this
            // 初始化地图
            var map = new BMap.Map("allmap", { minZoom: 7, maxZoom: 20 });    // 创建Map实例
            map.centerAndZoom(new BMap.Point(117.071470317, 36.600423896), 13);
            var opts = {
                width: 300, // 信息窗口宽度
                height: 200, // 信息窗口高度
                title: "山体信息", // 信息窗口标题
                enableMessage: true, //设置允许信息窗发送短息
            };
            //添加地图类型控件
            map.addControl(new BMap.MapTypeControl({
                mapTypes: [
                    BMAP_NORMAL_MAP,
                    BMAP_HYBRID_MAP
                ]
            }));
            map.setCurrentCity("济南");          // 设置地图显示的城市 此项是必须设置的
            map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
            // 获取所有山体坐标
            getAllLocation(that.secondaryCurrId, that.currentStreetId).then(res => {
                if (res.code == 200) {
                    that.Locations = res.data
                    console.log(res.data)
                    for (var i = 0; i < that.Locations.length; i++) {
                        var marker = new BMap.Marker(
                            new BMap.Point(
                                that.Locations[i].longitude,
                                that.Locations[i].latitude
                            )
                        );
                        if (that.Locations[i].logo) {
                            // 创建标注 .
                            var content = `<div>   
                           <h4 style='margin:0 0 5px 0;padding:0.2em 0'>${that.Locations[i].mountain_name}
                           (${that.Locations[i].area})</h4> 
                           <img style='float:right;margin:4px' id='imgDemo' src='${res.data[i].logo} 'width='139' height='104' title='${this.Locations[i].mountain_name}'/>   
                           <p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>${that.Locations[i].location}</p>  
                           </div>`;
                        } else {
                            // 创建标注 .
                            var content = `<div>   
                           <h4 style='margin:0 0 5px 0;padding:0.2em 0'>${that.Locations[i].mountain_name}(${that.Locations[i].area})</h4> 
                          
                           <p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>${that.Locations[i].location}</p>  
                           </div>`;
                        } 
                        map.addOverlay(marker); // 将标注添加到地图中
                        addClickHandler(content, marker);
                    }
                }
            })
            function addClickHandler(content, marker) {
                marker.addEventListener("click", function (e) {
                    openInfo(content, e);
                });
            }
            function openInfo(content, e) {
                var p = e.target;
                var point = new BMap.Point(p.getPosition().lng, p.getPosition().lat);
                var infoWindow = new BMap.InfoWindow(content, opts); // 创建信息窗口对象
                map.openInfoWindow(infoWindow, point); //开启信息窗口
            }
        }

    },
    // 全局过滤器
    filters: {
        phone(item) {
            return item.split(':')[1]
        }, 
        authorize(item) {
            if (item == 1) {
                return '区级山长'
            } else if (item == 2) {
                return '乡镇级山长'
            } else {
                return '巡查员'
            }
        },
        indexListTy(item) { 
            let time = item.split(' ')[0]    
            let newTime = time.replace(/(\d*)-(\d*)-(\d*)/g,'$1年$2月$3日') 
            return newTime
        }
    },

})
